<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>桃桃积慕</title>
    <link rel="stylesheet" href="/libs/swiper/css/swiper.min.css">
    <script src="/libs/swiper/js/swiper.min.js"></script>
    <script src="/libs/jquery-3.4.1.min.js"></script>
    <script src="/libs/jquery.elevateZoom-3.0.8.min.js"></script>
    <link rel="stylesheet" href="/css/detils.css">
</head>
<body>
    <header></header>
    <!-- 主页 -->
    <div class="wrap" id="wrap">
        <div class="wrap-top">
           <p><a href="#">首页</a>><a href="#">全部商品</a>><a href="#">蛋糕</a>><a href="#">桃桃/Peach Cake</a></p> 
        </div>
        <div class="wrap-cen" > 
            <div id="zuotu">

            </div>
            <script type="text/html" id="detilsTemplate">
            <div class="wrap-cen-r">
                <img src="{{imgs[0]}}" alt="" class="zoom-image">
                <ul id="gal1">
                    {{each imgs img}}
                    <li>
                        <a class="zoomGalleryActive" href="javascript:;" data-image="{{img}}" data-zoom-image="{{img}}"> 
                            <img src="{{img}}" alt="" class="smallpic" >                       
                        </a>
                    </li>
                    {{/each}}
                </ul>
            </div>
            <div class="wrap-cen-l">
                <h1>{{title}}</h1>
                <h2>
                    <span class="jiage">价格:</span>
                    <span class="jine">￥{{price}}</span>
                </h2>
                <div class="chicun">
                    <a href="#">1磅</a>
                    <a href="#">2磅</a>

                </div>
                <div class="shuom">
                    <ul>
                        <li>
                            <span><img src="/images/zhi.png" alt="">直径13cm*高6cm</span>
                        </li>
                        <li>
                            <span><img src="/images/shi.png" alt="">适合3-4人分享</span>
                        </li>
                        <li>
                            <span><img src="/images/cha.png" alt="">含4套餐具</span>
                        </li>
                        <li>
                            <span><img src="/images/ti.png" alt="">提前五小时预定</span>
                        </li>
                    </ul>
                </div>
                <div class="jia-jian">
                    <i class="reduce" href="#">－</i>
                    <span id="cont">1</span>
                    <i class="add" href="#">＋</i>
                </div>
                <div class="buy">
                    <span class="buyNow" >立即购买</span>
                    <span class="buyJon" id="addbuy-btn" >加入购物车</span>
                </div>
            </div>
           </script>
            
        </div>
        <div id="wrap-but"> 

        </div>
        <script type="text/html" id="datuTemplate">
        <div class="shuomingTu">
            {{each detilsImgs detilsImg}}
            <img src="{{detilsImg}}" alt="">
            {{/each}}
        </div>
        </script>
    </div>
    <div class="gwnum" id="gwnum">
        <span>0</span>
    </div>
    <footer></footer>
    <script src="/libs/require/require.min.js" data-main="js/detils"></script>
</body>
</html>